<div ng-controller="QuestionsController">
	<h1>Questions</h1>
	<p>Management of all questions.</p>
	<p class="delimiter"></p>
	<h2>Create a new question</h2>
	<form id="questionForm" name="questionForm">
		<p><b>Formulate a question</b><br/>
		<input id="text" size="100" ng-model="currentQuestion.text" required /><br /></p>
	    <p><b>Give the answers</b><br/>
		<label for="firstAnswer" class="big">First answer (correct):</label>&nbsp;&nbsp;<input id="firstAnswer" size="100" ng-model="firstAnswer.text" required value="richtige Antwort"/><br/>
		<label for="secondAnswer" class="big">Second answer:</label>&nbsp;&nbsp;<input id="secondAnswer" size="100" ng-model="secondAnswer.text" required value="falsch2"/><br/>
		<label for="thirdAnswer" class="big">Third answer:</label>&nbsp;&nbsp;<input id="thirdAnswer" size="100" ng-model="thirdAnswer.text" required /></p>
		<p><label for="author" class="small">Author: </label>
			<select id="author" required ng-model="selectedAuthor" ng-options="author as (author.firstname + ' ' + author.lastname) for author in authors">
        		<option value="">-- Select an author --</option>
	    	</select></p>
 		<p><label for="tag" class="small">Tag: </label>
	    	<select id="tag" ng-model="tag" ng-options="tag as tag.label for tag in tags">
        		<option value="">-- Select a tag --</option>
			</select></p>
		<button id="addLabel" ng-click="addLabel(tag.id)" >Adding this tag</button><br/>
		<div ng-repeat="tag in tagList">-{{tag.label}}
		<button id="removeLabel" ng-click="removeLabel(tag)">Remove this tag</button></div>
		<p class="delimiter"></p>
		<button id="save" ng-click="save(selectedAuthor.id)" ng-disabled="questionForm.$invalid">Save this question</button><button id="cancel" ng-click="cancel()">Cancel</button>
	</form>
	<p class="delimiter"></p>
	<h2>Editing and deleting of saved questions</h2>
	<table id="table" border="1">
		<thead>
			<tr>
				<th>Question</th>
				<th>Answer</th>
				<th>Tags</th>
				<th>Author</th>
				<th>Edit</th>
				<th>Delete</th>
			</tr>
		</thead>
		<tbody>
			<tr ng-repeat="question in questions">
				<td>{{question.text}}</td>
				<td><div ng-repeat="answer in question.answers">-{{answer.text}}</div></td>
				<td><div ng-repeat="tag in question.tags">-{{tag.label}}</div></td>
				<td><div>{{question.author.firstname}} {{question.author.lastname}}</div></td>
				<td><button id="edit" ng-click="edit(question)">Edit question</button></td>
				<td><button id="addLabel" ng-click="remove($index, question.id)">Delete question</button></td>
			</tr>
		</tbody>
	</table>
</div>

